<template>
  <div class="app-container">
    <el-table v-loading="loading" :data="recordList" @selection-change="handleSelectionChange">
      <el-table-column label="用户名" align="center" prop="nickname" />
      <el-table-column label="手机号" align="center" prop="phone" />
<!--      <el-table-column label="视频标题" align="center" prop="title" />-->
      <!-- <el-table-column label="封面" align="center" prop="cover" >
        <template #default="scope">
          <img :src="scope.row.cover" min-width="70" height="70"/>
        </template>
      </el-table-column> -->
      <el-table-column label="打卡时间" align="center" prop="checkinDate" width="180">
        <template #default="scope">
          <span>{{ parseTime(scope.row.checkinDate, '{y}-{m}-{d} {h}:{i}:{s}') }}</span>
        </template>
      </el-table-column>
      
    </el-table>

    <pagination v-show="total>0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize"
      @pagination="getList" />

  </div>
</template>

<script setup name="Record">
import { listRecord } from "@/api/mobile/checkin";
const route = useRoute();
const router = useRouter();

const { proxy } = getCurrentInstance();

const recordList = ref([]);
const open = ref(false);
const loading = ref(true);
const showSearch = ref(true);
const ids = ref([]);
const single = ref(true);
const multiple = ref(true);
const total = ref(0);
const title = ref("");

const data = reactive({
  form: {},
  queryParams: {
    pageNum: 1,
    pageSize: 10,
    prescriptionId: null
  },
  rules: {}
});

const { queryParams, form, rules } = toRefs(data);

/** 查询打卡记录列表 */
function getList() {
  loading.value = true;
  listRecord(queryParams.value).then(response => {
    recordList.value = response.rows;
    total.value = response.total;
    loading.value = false;
  });
}


(() => {
  const prescriptionId = route.params && route.params.id;
  if (prescriptionId) {
    queryParams.value.prescriptionId = prescriptionId
    loading.value = true;
    getList();
  }
})();


</script>
